<template>
    <div class="about-us">
        <Header colors="AboutUs"></Header>
        <div class="image">
            <img src="../../assets/img/about-us.png" alt="">
        </div>
        <div class="company-profile">
            <header>
                <span></span>
                <h2>指尖互动</h2>
            </header>
            <div class="text">
                <p class="company-profile-text">厦门指尖互动文化传播有限公司专注于移动互联网、致力于为企业提供更专业更实效的一站式渠道拓展、移动广告营销解决方案。公司服务内容包括互联网的产品渠道分发与推广、媒体投放、公司品牌营销、新媒体营销、广告数据优化以及流量采购等定制化营销方案。一站式渠道服务，省时省心；设置分平台承包、多渠道分发，定制推广方案；支持效果评估，大数据分析指导渠道优化；根据效果结算，缩减成本，提高流量效果。</p>
            </div>
        </div>
        <div class="team">
            <header>
                <span></span>
                <h2>优质团队</h2>
            </header>
            <div class="image">
                <img src="../../assets/img/team.png" alt="">
            </div>
            <div class="text">
                <p class="team-text">公司创始团队来自百度，腾讯，91无线及网龙知名互联网公司，拥有完整的渠道、运营、商务、设计、美术、研发团队等，拥有丰富的渠道、媒体、商务等资源，团队具有很强的运营和推广能力。</p>
                <p class="team-text p-two">我们尊重每次合作的机会与挑战，不断精进，力求完美。</p>
                <p class="team-text p-three">团队秉承“勇于创新、极致服务、诚信敬业”的服务理念，致力于移动互联网一站式渠道与营销服务。</p>
            </div>
        </div>
        <ContactUs/>
        <div class="footer">
            <p>Copyright © 2016-2018 指尖互动 All Rights Reserved | </p>
            <a href="http://www.miitbeian.gov.cn/" target="_blank">闽ICP备16031728号-1</a>
        </div>
    </div>
</template>
<script>
import Header from '../common/components/Header'
import ContactUs from '../common/components/ContactUs'
export default {
    name: 'AboutUs',
    data () {
        return {

        }
    },
    components: {
        Header,
        ContactUs
    }
}
</script>
<style scoped>
.about-us {
    width: 100%;
}
.about-us .image {
    width: 100%;
}
.about-us .image  img {
    width: 100%;
    height: auto;
    max-width: 100%;
    display: block;
}
.about-us .company-profile {
    margin-top: 100px;
}
.about-us .company-profile header,.about-us .team header,.about-us .fiction header {
    text-align: center;
}
.about-us .company-profile header span,.about-us .team header span,.about-us .fiction header span {
    display: inline-block;
    width: 55px;
    height: 39px;
    background: url("../../assets/img/down.png") no-repeat;
    background-size: cover;
}
.about-us .company-profile header h2,.about-us .team header h2,.about-us .fiction header h2 {
    font-size: 48px;
    color: #1e90ff;
    margin-top: 20px;
}
.about-us .company-profile .text {
    width: 670px;
    margin: 80px auto 0;
}
.about-us .company-profile .text .company-profile-text {
    font-size: 28px; /*px*/
    color: #05173b;
    display: inline-block;
    line-height: 40px;
    padding-left: 10px;
}
.about-us .team {
    margin-top: 100px;
}
.about-us .team .image {
    width:670px;
    margin: 80px auto 0;
}
.about-us .team .image img {
    width: 100%;
    height: auto;
    max-width: 100%;
    display: block;
}
.about-us .team .text {
    margin: 60px auto 0; 
    width:670px;
}
.about-us .team .text .team-text{
    font-size: 28px; /*px*/
    color: #05173b;
    display: inline-block;
    line-height: 40px;
    padding-left: 10px;
}
.about-us .team .text .p-two {
    margin-top: 40px;
}
.about-us .team .text .p-three {
    margin-top: 40px;
}
.about-us .footer {
    width: 100%;
    height: 50px;
    background-color: #1e90ff;
    color: #fff;
    font-size: 16px; /*px*/
    margin-top: 100px;
    line-height: 50px;
    text-align: center;
}
.about-us .footer p {
    display: inline-block;
}
.about-us .footer a {
    text-decoration: none;
    color: #fff;
}
@media screen and (max-width: 640px) and (min-width: 640px) {
.about-us .contact-us .contact-information .business,.home .contact-us .contact-information .channel {
    margin-left: 10px;
}
}
@media screen and (max-width:1242px) and (min-width: 1233px) {
.about-us .company-profile .text .company-profile-text {
    font-size: 32px; /*px*/
    padding-left: 20px;
    
}
.about-us .team .text .team-text {
    font-size: 32px; /*px*/
    padding-left: 20px;
}
}
</style>
